import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from "vuex-persistedstate";
Vue.use(Vuex)

export default new Vuex.Store({
  plugins: [createPersistedState()],
  state: {
    activeTab : "all",
    todos : JSON.parse(localStorage.getItem("vuex") || "[]"),
    checked : true,
  },
  mutations: {
    addTodo : function(state,{payload}){
      state.todos.push(payload);
    },
    bian : function(state,{payload}){
      if(payload.keys){
        state.todos.map(v => {
          v.status = false;
        });
      }else{
        state.todos.map(v => {
          v.status = true;
        });
      }
    },
    deletTodo : function(state,{payload}){
      state.todos.splice(payload.index,1);
    },
    changeActiveTab : function(state,{payload}){
      state.activeTab = payload.activeTab;
    },
    deletAllTodo : function(state){
      state.todos = state.todos.filter(v => {
        if(!v.status){
          return true;
        }
      });
    },
  },
  getters : {
    activeTab : function(state){
      return state.activeTab;
    },
    quan : function(state){
      let checked = true;
      state.todos.filter(
        v => {
          if(!v.status){
            return checked = false;
          }
        }
      )
        return checked;
    },
    filterTodos : function(state){
      if(state.activeTab === "all"){
        return state.todos;
      }else if(state.activeTab === "wan"){
        return state.todos.filter(x => {
          if(!x.status){
            return true;
          }
        });
      }else if(state.activeTab === "wei"){
        return state.todos.filter(x => {
          if(x.status){
            return true;
          }
        });
      };
    },
    changdu : function(state){
      return state.todos.filter(v => {
        if(!v.status){
          return true;
        }
      }).length;
    },
  },
  actions: {
  },
  modules: {
  }
})
